<template>
    <!-- 主要内容第二部分 -->
    <div id="app-two">
        <img src="/imgs/home/title02.png" class="title02">
        <p id="two-part-p">从入门到精通 系统学习 知识点由浅入深 名师指路</p>
        <div id="two-part-div">
            <div 
                v-for="(imgthree,index) in imgsThree"
                :key="index"
                class="app-two-part"
            >
                <img :src="imgthree.url" class="imgthree">
                <p class="two-part-line1">{{imgthree.intro}}</p>
                <p class="two-part-line2">{{imgthree.inquiry}}</p>
                <span class="two-part-line3">点击咨询</span>
            </div>
        </div>
        <div id="two-footer">立刻选择学习课程</div>
    </div>
</template>

<script>
  export default {
    name:'',
    props:[''],
    data () {
      return {
          imgsThree:[
                {
                    url:'/imgs/home/tu05.png',
                    intro:'我是0基础/应届生',
                    inquiry:'我想学开网店，能学会吗？',
                },
                {
                    url:'/imgs/home/tu06.png',
                    intro:'我在职，想转行',
                    inquiry:'现在的工作没发展，想转行能行吗？',
                },
                {
                    url:'/imgs/home/tu07.png',
                    intro:'我是运营助理想提升',
                    inquiry:'工作遭遇瓶颈，想充电学习，可以吗？',
                },
            ],
      };
    },

    components: {},

    computed: {},

    beforeMount() {},

    mounted() {},

    methods: {},

    watch: {}

  }

</script>
<style scoped>
/* 主要内容第二部分 */
#app-two{
	text-align: center;
	background-color: #E8E9ED;
    padding-bottom: 106px;
}
.title02{
	margin-top: 113px; 
}
#two-part-p{
	margin: 31px 0;
	color: #484848;
	font-size: 20px;
}
#two-part-div{
	width: 1200px;
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	margin-top: 82px;
}
.app-two-part{
	width: 382px;
	height: 588px;
    background-color: #ffffff;
}
.imgthree{
    width: 100%;
    height: 382px;
}
.two-part-line1{
	font-size: 30px;
	font-weight: bold;
	margin-top: 50px;
}
.two-part-line2{
	color: #959595;
	margin: 12px 0;
}
.two-part-line3{
	display: inline-block;
	width: 129px;
	height:38px;
	color: #041F46;
	border: 1px solid rgba(4,31,70,1);
    padding: 7px 30px;
}
#two-footer{
    width: 424px;
    height: 73px;
    background-color: #02B2FB;
    color: #ffffff;
    font-size: 24px;
    padding: 25px 116px;
    margin: 0 auto;
    margin-top: 69px;
}
</style>